/*
 * @Author: hc
 * @Date: 2023-10-12 11:30:09
 * @LastEditTime: 2023-10-13 10:22:35
 * @LastEditors: hc
 * @Description:
 */
import React, { CSSProperties } from 'react';
import { List } from 'antd';
import { Layout, udp } from '@cscec/udp-ui';
import { PortalTitle, containerStyle, useList } from '../common';
import type { ITaskList } from '../portal';

/** 描述信息节点 */
function Node({ text }: { text: string | undefined }) {
  if (text) {
    return <div style={{ marginRight: 16 }}>{text}</div>;
  }
  return null;
}

/** 描述信息 */
function Description({ item }: { item: ITaskList }) {
  return (
    <Layout direction="row">
      <Node text={item.creator} />
      <Node text={item.createtime} />
      <Node text={item.remark} />
    </Layout>
  );
}

export interface IProps {
  title: string;
  style?: CSSProperties;
  source?: any;
  defaultData?: ITaskList[];
  [x: string]: any;
}

/**
 * 文字列表
 */
export default function CommonTask(props: IProps) {
  const {
    title, style, source, env, defaultData,
  } = props;

  const { list, loading, pagination } = useList<ITaskList>({ env, source, defaultData });

  const openUrl = ({ link, routeName, title: urlTitle }: ITaskList) => () => {
    if (env?.session !== 'render') {
      return;
    }

    if (link) {
      udp.open(link, {
        AppTitle: urlTitle,
        microAppName: routeName,
      });
    }
  };

  return (
    <div style={{ ...containerStyle, ...style }}>
      <PortalTitle>{title}</PortalTitle>
      <div style={{ minHeight: 165 }}>
        <List
          loading={loading}
          pagination={pagination}
          dataSource={list}
          renderItem={(item, index) => (
            <List.Item
              key={index}
              extra={item.type || ''}
            >
              <List.Item.Meta
                // eslint-disable-next-line jsx-a11y/anchor-is-valid
                title={item.link ? <a role="button" onClick={() => openUrl(item)}>{item.title}</a> : item.title}
                description={<Description item={item} />}
              />
            </List.Item>
          )}
        />
      </div>
    </div>
  );
}
